<template>
  <div class="shop-header wrapper">
    <div class="logo">
      <a href="index.html"><img src="img/logo.png" alt="logo" /></a>
    </div>
    <div class="shop-schbox">
      <div class="layout">
        <form action="" method="">
          <input v-model="query.commodityName" class="search-txt" placeholder="搜流行宝贝">
          <button @click="searchGood()" class="search-btn site">搜全站</button>
          <div class="suggest-box">
            <div class="item" data-title="上衣 短款 短袖">上衣 短款 短袖<div class="tags"><span>雪纺</span><span>蕾丝</span><span>一字领</span></div></div>
          </div>
        </form>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: 'GoodHeader',
  data () {
    return {
      query: {
        commodityName: null,
        brandId: null,
        categoryId: null
      }
    }
  },
  methods: {
    searchGood () {
      this.$router.push({path: '/searchGood', query: { commodityName: this.query.commodityName, brandId: this.query.brandId, categoryId: this.query.categoryId }})
      this.$router.go(0)
    }
  }
}
</script>
<style>
</style>
